!!!
- title = "http.errors.#{name}.title".t
%html
  %head
    %title= title
    %meta{charset: "UTF-8"}
    %meta{content: "width=device-width,initial-scale=1", name: "viewport"}
    :scss
      @import url(//fonts.googleapis.com/css?family=Open+Sans:300,300italic,400,400italic,700,700italic);
      $base-color: #D81E08;
      $text-color: #333333;
      html {
        height: 100%;
        background: #F7F7F7;
        background-size: cover;
        color: $text-color;
        font-family: 'Open Sans', sans-serif;
        margin: 0;
        body {
          margin: 0;
        }
      }

      div.dialog {
        background: rgba(255, 255, 255, 0.75);
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: center;

        .content {
          flex: 1;
          margin: 4em auto 0;
          margin: 10vh auto 0;
          max-width: 33em;
          padding: 3em;
          padding: 15vh 20vw;
          border-top: 1px solid #d81e08;
          border-bottom: 1px solid #d81e08;
          h1 {
            font-size: 140%;
            color: $base-color;
            line-height: 1.5em;
          }
         #error-code {
           text-align: center;
         }
        }
        &.legals {
          text-align: center;
          font-size: 80%;
          padding: 2em;
          padding: 3vh;
          background: rgba(255, 255, 255, 0.55);
        }
      }


  %body
    .dialog
      .content
        %h1= title
        - hint = "http.errors.#{name}.hint".t(default: "")
        - unless hint.blank?
          %p= hint
    .dialog.legals= "Ekylibre #{Ekylibre::VERSION}"
